<!--created by Chuanpeng.zhu@dhc.com.cn-->
<ion-view view-title="快速渲染">
  <ion-content>
    <div class="padding">
      <ion-refresher pulling-text="下拉刷新" refreshing-text="正在刷新" on-refresh="init()"></ion-refresher>
      <p class="indent">我们通常在前台用ng-repeat来循环数组展示列表，但是数组元素一旦过多，就会出现卡顿的情况。</p>

      <p class="indent">而collection-repeat是一个允许你渲染数千项列表，并且性能几乎不会减弱的指令。</p>

      <div class="" collection-repeat="item in dataList track by $index" collection-item-width="95%"
           collection-item-height="200px">
        <div class="margin-10 padding-left-right-10 border">
          <div ng-bind="item.text" class="margin-top-10 margin-bottom-10"></div>
          <div class="row">
            <div class="col" ng-repeat="data in item.img track by $index">

              <img ng-src="{{data}}" alt="图片" class="width-100"/>
            </div>
          </div>
        </div>
        <!--<img ng-repeat="data in item.img track by $index" ng-src="{{data}}" alt="图片" class="width-100px padding-right-10"/>-->
      </div>
      <ion-infinite-scroll on-infinite="loadData(true)" distance="1%" immediate-check="false" ng-if="hasMore">
      </ion-infinite-scroll>
    </div>

  </ion-content>
</ion-view>
